<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
    <style></style>
  </head>
  <body>
    <div>
      <h1>数组的解构</h1>
    </div>
    <script>
      const arr = [100, 200, 300];
      // 以前的做法
      const f1 = arr[0];
      const f2 = arr[1];
      const f3 = arr[2];
      console.log(f1, f2, f3); //100 200 300

      //ES2015数组的结构
      const [f4, f5, f6] = arr;
      console.log(f4, f5, f6); // 100 200 300

      //只要获取个别成员的话,需要逗号补上保证一致格式
      const [, , f7] = arr;
      console.log(f7); //300

      //...的用法只能放在最后一个成员
      const [foo, ...rest] = arr;
      console.log(rest); //[200,300]

      //只有一个成员默认获取第一个
      const [f8] = arr;
      console.log(f8); //100

      //超出成员数量  undefined
      const [f9, f10, f11, f12] = arr;
      console.log(f12); //undefined

      //成员默认值(没有提取到数组对应的值才用默认值)
      const [f13, f14 = "2000", f15 = "400", f16 = 500] = arr;
      console.log(f13, f14, f15, f16); //100 200 300  500
    </script>
  </body>
</html>
